Komen Kaarten (Come card with me) is a webapp spin-off of the popular serie Come Dine With Me. Card enthousiasts come together to have fun and rate eachother. You can check out the project here.

 

This project was a collaboration with Lieselot Verheye and was finished in one week. This included concept, design and code. Lieselot was responsible for the design and frontend while I took care of the backend with Javascript, JQuery, PHP, SQL, Backbone and Handlebars. 

 

Head on over to our design page on behance if you want to see more screens of this project.

First-time users are invited to register (1st screen). Google API was used to get the current location of the user and custom AJAX calls were made to save a profile photo.
 

Each user is assigned to a group of 4 and has their own day in which to host the others. Handlebars was used to reuse HTML-code, which can be seen in the week overview (2nd screen). Previous days are colorcoded green, the current day is red, and days to come are coded grey and can't be accessed yet.

 

Users can vote by clicking on the current day. Users can also see their votes from previous days or add photos.

At the end of the week the votes are tallied up and a winner announced. This was a feature that took a long time to implement. The logic behind the code and how the variables were passed along was a challenge. The votes were saved into a database and all interaction was done with an api, written with Backbone.

I also used API middleware to secure the API and make sure that outsiders couldn't access the adresses of the users.

The last feature to be implemented was a small CMS system. Admin users are shown a small dropdown where they can change what day it was. This was partially made to test if the day-system worked.

 

You can check out the code on Github and try out the webapp here.